body {
  height: 100%;
  width: 100%;
  padding: 0;
  font: 14px 'Lucida Grande', Helvetica, Arial, sans-serif;
}

html,
body,
.map {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background-color: #333333;
}

#map {
  width: 100vw;
  height: 80vh;
}
/* The NavBar at the Top*/
.mainNav {
  position: relative;
  z-index: 2;
}

/* The sidebar menu */
/*.sidenav {*/
/*height: 92vh; !* Full-height: remove this if you want "auto" height *!*/
/*width: 20vw; !* Set the width of the sidebar *!*/
/*position: fixed; !* Fixed Sidebar (stay in place on scroll) *!*/
/*z-index: 1; !* Stay on top *!*/
/*top: 0; !* Stay at the top *!*/
/*left: 0;*/
/*background-color: #333333;*/
/*overflow-x: hidden; !* Disable horizontal scroll *!*/
/*padding-top: 50px;*/
/*}*/

/* The navigation menu links */
/*.sidenav a {*/
/*padding: 6px 8px 6px 16px;*/
/*text-decoration: none;*/
/*font-size: 25px;*/
/*color: #818181;*/
/*display: block;*/
/*}*/

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #f1f1f1;
}

/* Style page content */
.main {
  /*margin-left: 200px; !* Same as the width of the sidebar *!*/
  padding: 0px 0px;
  height: 70vh;
}

/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {
    padding-top: 15px;
  }
  .sidenav a {
    font-size: 18px;
  }
}

/* Changes mouse control from black to white */
.ol-mouse-position {
  color: #f1f1f1;
  background-color: #111111;
  opacity: 0.6;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}
/* For About Modal */
#contentarea {
  font-size: 15px;
  margin: 16px 0;
}
.cell {
  outline: 0;
  min-height: 20px;
  margin: 5px 0;
  padding: 5px 0;
}
.markdown-cell {
  font-size: 15px;
}
/* ======================= */

#layer-select {
  width: 13vw;
}
#draw-type {
  width: 13vw;
}

.footer {
  position: fixed;
  height: 40px;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;
  background-color: #333333;
  text-align: center;
}
